<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>文章发布</title>
		<script type="text/javascript" src="../../resources/js/jquery-1.11.1.min.js"></script>
		<link rel="stylesheet" href="../../resources/layui/css/layui.css" />
		<link rel="stylesheet" href="../../resources/css/artcleedit.css" />
		<script type="text/javascript" src="../../resources/js/moxie.js"></script>
		<script type="text/javascript" src="../../resources/js/plupload.full.min.js"></script>
		<script type="text/javascript" src="../../resources/js/qiniu.js"></script>
		<!--<script type="text/javascript" src="../../resources/js/qiniu_img_upload.js" ></script>-->
	</head>

	<body>
		<jsp:include page="/pages/common/header.jsp"></jsp:include>
		<div class="main">
			<div class="content">
				<form class="layui-form" method="post">
					<div class="layui-form-item">
						<label class="layui-form-label">提问标题</label>
						<div class="layui-input-block">
							<input type="text" id="title" required lay-verify="artcletitle" placeholder="请输入标题" class="layui-input" value="">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">提问分类</label>
						<div class="layui-input-inline" lay-filter="test2">

							<!-- lay-verify="required  用于更新渲染"-->
							<!--form.render();-->
							<!--用于更新渲染-->
							<select class="layui-select" id="questionParentType" lay-filter='selectfilter'>
							</select>

						</div>
						<div class="layui-input-inline">
							<select name="questionSonType" id="questionSonType">
							</select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">积分</label>
						<div class="layui-input-inline">
							<input type="interal" id="interal" required lay-verify="interal" placeholder="请设置积分" class="layui-input" value="">
						</div>
						<div class="layui-form-mid layui-word-aux">扣除自己积分</div>
					</div>
					<div id="txtarea" name="" lay-verify="questionContent">

					</div>
					<div class="layui-form-item">
						<div class="layui-input-block" id="btn">
							<button class="layui-btn layui-btn-danger" id="questionSubmit" lay-submit lay-filter="play">立即发布</button>
						</div>
					</div>
				</form>
			</div>
		</div>
		<script>
			layui.use('form', function() {
				var form = layui.form;
				form.verify({
					artcletitle: function(value, item) {
						if(value == "" || /^\s+$/g.test(value)) {
							return '标题不能为空或空格';
						}
					},
					
					articleContent: function() {
						if(editor.txt.html() == "<p><br></p>") {
							return "提问内容呢??!";
						}
						if(editor.txt.html().length < 10) {
							return "内容太少啦吧！！,十个字都没有";
						}
					},
					interal: [
								/^[1-9]\d*|0$/,
								'积分只能为正整数..'
							]

				});

				form.on('submit(play)', function() {
					var loading = layer.msg('请稍后....正在发布', {
						icon: 16,
						shade: 0.01,
					});
					var smallType = $("#questionSonType").val();
					var title = $("#title").val();
					var content = editor.txt.html();
					var interal = $("#interal").val();
					$.ajax({

						url: '/article/addQuestion.action',
						type: 'POST',
						data: {
							"article.articleTitle": title,
							"article.articleContent": content,
							"article.articleTypeId": smallType,
							"article.interal": interal
						},
						dataType: 'json',
						done: function() {
							layer.close(loading, {
								time: 2 * 1000
							});
						},
						success: function(data) {
							if(data.result == true) {
								$.ajax({
									type: "post",
									url: "/article/reduceUserInteral.action",
									dataType: 'json',
									data: {
										"article.interal": interal
									},
									success: function(result) {
										var resu = result.result;
										if(resu == true) {
											layer.msg('发布成功！', {
												icon: 1,
												shade: 0.01
											});
											window.location.href = ("/pages/question/question.jsp")
										}
									}
								});

							} else {
								layer.msg('上传失败！', {
									icon: 2,
									shade: 0.01
								});
								editor.txt.clear();
							}
						},
						error: function() {
							layer.msg("错误");
						}
					});
					return false; //阻止表单跳转
				});
			});
		</script>
		<jsp:include page="/pages/common/footer.jsp"></jsp:include>
		<jsp:include page="/pages/common/editor.html"></jsp:include>

		<script type="text/javascript">
			$(document).ready(function() {
				$.ajax({
					url: '/article/queryArticleType.action',
					dataType: 'json',
					data: {
						"articleType.articleSubTypeId": 1
					},
					type: 'post',
					success: function(reasult) {
						$('#questionParentType').append("<option>请选择分类</option>");
						$.each(reasult, function(index, item) {
							$('#questionParentType').append("<option value=" + item.articleTypeId + ">" + item.typeValue + "</option>"); //往下拉菜单里添加元素
						})
						renderForm();
					}
				});
			});

			layui.use("form", function() {
				var form = layui.form;
				form.on('select(selectfilter)', function(data) {
					var obj = document.getElementById('questionSonType');
					obj.options.length = 0;
					$.ajax({
						url: '/article/queryArticleType.action',
						dataType: 'json',
						data: {
							"articleType.articleSubTypeId": data.value
						},
						type: 'post',
						success: function(reasult) {
							$.each(reasult, function(index, item) {
								$('#questionSonType').append("<option value=" + item.articleTypeId + ">" + item.typeValue + "</option>"); //往下拉菜单里添加元素
							})
							renderForm();
						}
					});
				});
			});

			function renderForm() {
				layui.use('form', function() {
					var form = layui.form; //高版本建议把括号去掉，有的低版本，需要加()
					form.render('select');
				});
			}
		</script>
		<script>
			$("#interal").blur(function() {
				var interal = $("#interal").val();
				$.ajax({
					type: "post",
					url: "/article/isHaveEnoughIntegral.action",
					dataType: "json",
					data: {
						"article.interal":interal
					},
					success: function(data) {
						if(data.result == true) {
							layer.msg("积分够用", {
								icon: 1
							});
						}else{
							layer.msg("积分不够啊！！", {
								icon: 2
							});
							$("#interal").val("");
							$("#interal").focus();
						}
					}
				});
			})
		</script>
	</body>

</html>